
import React, { useState, useEffect } from 'react'
import './css/OrderSet/OrderSet.less'
import '../../css/public.less'
import { Input, Card, Space, Select, Button, Form, message } from 'antd';
import { orderSetTime, selectorderSetTime } from '../../../api/OrderApi'
//接口
interface DataType {
	automaticClose: number,		//自动关闭订单，无法售后
	automaticComment: number,	//自动五星好评
	automaticSet: number,	//自动确认时间（小时）
	automaticOk: number,		//自动完成订单
	closeTime: number,			//未付款订单，关闭订单
	noRemarksAutomaticOk: number,	//*无备注订单超过
}

const OrderSet = () => {
	const [form] = Form.useForm();
	// const [day, setInputDay] = useState<number>()  	//未付款订单，关闭订单（分钟）
	// const [time, setInputTime] = useState<number>()  //自动确认时间（小时）
	// const [dayone, setInputDayone] = useState<number>()	///自动完成订单（天）
	// const [daytwo, setInputDaytwo] = useState<number>()  //自动关闭订单，无法售后（天）
	// const [daytherr, setInputDaytherr] = useState<number>()   //自动五星好评（天）
	// const [timeone, setInputTimeone] = useState<number>()   //*无备注订单超过（小时）
	// const [data, setData] = useState<DataType[]>([])

	const [num4, setAutomaticClose] = useState<number>()		//4
	const [num5, setAutomaticComment] = useState<number>()		//5
	const [num2, setAutomaticConfirmation] = useState<number>()	//2
	const [num3, setAutomaticOk] = useState<number>()		//3
	const [num1, setCloseTime] = useState<number>()		//1
	const [num6, setNoRemarksAutomaticOk] = useState<number>()		//6



	//1
	const changeDay = (e: any) => {
		let day = e.target.value
		setCloseTime(day)
		console.log('day', day);
	}

	//2
	const changeTime = (e: any) => {
		let time = e.target.value
		setAutomaticConfirmation(time)
		console.log('time', time);

	}
	//3
	const changeDayone = (e: any) => {
		let dayone = e.target.value
		setAutomaticOk(dayone)
		console.log('dayone', dayone);

	}
	//4
	const changeDaytwo = (e: any) => {
		let daytwo = e.target.value
		setAutomaticClose(daytwo)
		console.log('daytwo', daytwo);

	}
	//5
	const changeDaytherr = (e: any) => {
		let daytherr = e.target.value
		setAutomaticComment(daytherr)
		console.log('daytherr', daytherr);

	}
	//6
	const changeTimeone = (e: any) => {
		let timeone = e.target.value
		setNoRemarksAutomaticOk(timeone)
		console.log('timeone', timeone);

	}

	// 初始获取所有订单数据
	useEffect(() => {
		// 发起请求，查询所有订单
		getAllone()
	}, [])



	const getAllone = () => {
		selectorderSetTime({
		}).then(res => {
			console.log('获取成功了哟', res);
			// message.success('查询成功')
			setAutomaticClose(res.data[0].automaticClose)
			setAutomaticComment(res.data[0].automaticComment)
			setAutomaticConfirmation(res.data[0].automaticSet)
			setAutomaticOk(res.data[0].automaticOk)
			setCloseTime(res.data[0].closeTime)
			setNoRemarksAutomaticOk(res.data[0].noRemarksAutomaticOk)
			// setData(res.data)
		}).catch(err => {
			console.log('err失败了哟', err);
			message.error('服务器出错啦~~~')
		})
	}


	// let automaticClose = { ...data[0] }.automaticClose
	// let automaticComment = { ...data[0] }.automaticComment
	// let automaticConfirmation = { ...data[0] }.automaticConfirmation
	// let automaticOk = { ...data[0] }.automaticOk
	// let closeTime = { ...data[0] }.closeTime
	// let noRemarksAutomaticOk = { ...data[0] }.noRemarksAutomaticOk
	// console.log('渲染值获取到了哟', automaticClose, automaticComment, automaticConfirmation, automaticOk, closeTime, noRemarksAutomaticOk);
	// setAutomaticClose({ ...data[0] }.automaticClose)
	// setAutomaticComment({ ...data[0] }.automaticComment)
	// setAutomaticConfirmation({ ...data[0] }.automaticConfirmation)
	// setAutomaticOk({ ...data[0] }.automaticOk)
	// setCloseTime({ ...data[0] }.closeTime)
	// setNoRemarksAutomaticOk({ ...data[0] }.noRemarksAutomaticOk)



	const filterInput = () => {
		// let obj = {
		// 	automaticClose: daytwo,
		// 	automaticComment: daytherr,
		// 	automaticConfirmation: time,
		// 	automaticOk: dayone,
		// 	closeTime: day,
		// 	noRemarksAutoma: timeone,
		// }
		console.log('打印最后的值', num1, num2, num2, num4, num5, num6);
		orderSetTime({
			automaticClose: num4,
			automaticComment: num5,
			automaticSet: num2,
			automaticOk: num3,
			closeTime: num1,
			noRemarksAutoma: num6,
		}).then(res => {
			console.log('修改成功了哟', res);
			message.success('修改成功')
			getAllone()
		}).catch(err => {
			console.log('err失败了哟', err);
			message.error('服务器出错啦~~~')
		})
	}

	return (
		<div className='OrderSet'>
			{/* 头部 */}
			<div className='page-top'>
				{/* 左边标题 */}
				<div className='page-title'>
					<p>订单列表</p>
				</div>
			</div>

			{/* 内容区 */}
			<div className='page-context'>
				{/* 查询部分 */}
				<Card title="订单设置" type="inner" className='orderset_content'>
					<div className="content_box">
						<Space className='space'>
							<p className='span-span'> <span className='icon'>*</span> 正常订单超过</p><Input className='input' addonAfter="分" value={num1} onChange={changeDay} /><p className='span-span1'>未付款，订单自动关闭</p>
						</Space>
						<Space className='space'>
							<p className='span-span'><span className='icon'>*</span>付款超过</p><Input className='input' addonAfter="小时" value={num2} onChange={changeTime} /><p className='span-span1'>未确认订单，订单自动确认</p>
						</Space>
						<Space className='space'>
							<p className='span-span'><span className='icon'>*</span>发货超过</p><Input className='input' addonAfter="天" value={num3} onChange={changeDayone} /><p className='span-span1'>未确认收货，订单自动完成</p>
						</Space>
						<Space className='space'>
							<p className='span-span'><span className='icon'>*</span>订单完成超过</p><Input className='input' addonAfter="天" value={num4} onChange={changeDaytwo} /><p className='span-span1'>自动关闭，不能申请售后</p>
						</Space>
						<Space className='space'>
							<p className='span-span'><span className='icon'>*</span>订单完成超过</p><Input className='input' addonAfter="天" value={num5} onChange={changeDaytherr} /><p className='span-span1'>自动五星好评</p>
						</Space>
						<Space className='space'>
							<p className='span-span'><span className='icon'>*</span>无备注订单超过</p><Input className='input' addonAfter="小时" value={num6} onChange={changeTimeone} /><p className='span-span1'>自动确认</p>
						</Space>
					</div>
					{/* 提交按钮 */}
					<div className="submit_btn">
						<Button type='primary' className='submit' onClick={filterInput}>提交</Button>
					</div>
				</Card>
			</div>
			{/* 数据表格部分 */}
			<div className='data-list'>

			</div>
		</div>
	)


}


export default OrderSet